<template>
    <div class="pr">
      <div class="cover-box"  @click.stop="$parent.$parent.onEditer(index)"></div>
      <div class="drag-optional" :class="{selected:index === selectedIndex}">
        <div class="diy-video" :style="{padding:item.style.paddingTop + 'px 0'}">
          <video :style="{height:item.style.height + 'px'}" :src="item.params.videoUrl" :poster="item.params.poster"
            :autoplay="item.params.autoplay == 1" controls>
            您的浏览器不支持 video 标签
          </video>
        </div>
        <div class="btn-edit-del">
          <div class="btn-del" @click.stop="$parent.$parent.onDeleleItem(index)">删除</div>
        </div>
      </div>
    </div>
</template>

<script>
  export default {
    data() {
      return {

      };
    },
    props: ['item', 'index', 'selectedIndex'],
    methods: {
        
    }
  };
</script>

<style>

.diy-video video{ display: block; width: 100%;}
.cover-box{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 10;}
</style>
